<template>
  <menu-wrapper
    v-model="dialogVisible"
    inner-style="width:120px;top:52px;right:20px;"
  >
    <template #content>
      <div class="header-top-setting-popup">
        <div
          v-for="item in menuList"
          :key="item.title"
          class="menu-item"
          @click="item.click"
        >
          <div class="menu-item-title">
            {{ item.title }}
          </div>
        </div>
      </div>
    </template>
  </menu-wrapper>
</template>

<script setup lang="ts">
import { computed, onMounted,watch } from 'vue'
import useDialogPromiseHook from '@/hooks/use-dialog-promise-hook'
import { invokeAsyncAPi } from '@/utils/xz-fn'

const props = defineProps({
  modelValue: {
    type: Boolean,
    default:false
  }
})
const emit = defineEmits(['update:modelValue'])
const dialog = useDialogPromiseHook();

const dialogVisible = computed({
  get() {
    return props.modelValue
  },
  set(value) {
    emit('update:modelValue', value)
  }
})

const menuList = [
  {
    title: '设置中心',
    icon: 'menu-setting',
    key: 'setting',
    click: () => {
      dialogVisible.value = false;
      dialog.showDialog('setting').then(() => {
      }).catch(() => {
      })
    }
  },
  // {
  //   title: '检查更新',
  //   icon: 'menu-update',
  //   key: 'update',
  //   showTab: '3',
  //   click: () => {
      
  //   }
  // },
  {
    title: '联系我们',
    icon: 'menu-info',
    key: 'advice',
    click: () => {
      dialogVisible.value = false;
      dialog.showDialog('dialogQr')
      .then(() => {})
      .catch(() => {})
    }
  },
  {
    title: '检查更新',
    icon: 'menu-info',
    key: 'advice',
    click: () => {
      dialogVisible.value = false;
      invokeAsyncAPi('fq_CheckSoftUpdate')
    }
  }
]


</script>

<style scoped lang="scss">
.header-top-setting-popup{
  .menu-item{
    height:40px;
    text-align: center;
    line-height: 40px;
    cursor: pointer;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 14px;
    color: #192655;
    &:hover{
      background: rgba(30,140,255,0.2);
    }
  }
}
</style>
